<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title> 
<!-- 引入element样式 -->
<link rel="stylesheet"
	href="../public/plugins/element-ui/lib/theme-chalk/index.css">
<script src="../public/libs/vue.js"></script>
<!--引入element组件库-->
<script src="../public/plugins/element-ui/lib/index.js"></script>
<script src="../public/plugins/axios/dist/axios.js"></script> 
</head>
<body>
	<div id="headVue"  >
		<!--#87CEEB-->
		<div style="background-color:#87CEEB" align="center">	
			<el-row :gutter=10></el-row>
			 <el-row  :gutter=10 type="flex" justify="center"> 
				<el-col :span=2 >
					<span>产品图号:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.quotationNo" size="mini" placeholder="产品图号" 
					 oninput="value=value.replace(/[^J]\D{6}/g,'')"></el-input>
				</el-col>
				<el-col :span=2 >
					<span>客户编码:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.cardCode" size="mini" placeholder="客户编码"></el-input>
				
				</el-col> 
				<el-col :span=2 >
					<span>客户名称:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.cardName" size="mini" placeholder="客户名称"></el-input>
				 </el-col> 
			</el-row>
			<el-row :gutter=10 type="flex" justify="center">
				 <el-col :span=2 >
					<span>产品编码:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.cardCode" size="mini" placeholder="产品编码"></el-input>				
				</el-col> 
				<el-col :span=2 >
					<span>规格型号:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.cardCode" size="mini" placeholder="规格型号"></el-input>				
				</el-col> 
				<el-col :span=2 >
					<span>产品名称:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.cardCode" size="mini" placeholder="产品名称"></el-input>				
				</el-col> 
			</el-row>
			<el-row :gutter=10 type="flex" justify="center">
				<el-col :span=2  >
					<span>合同编号:</span> 
				</el-col>
				<el-col :span=5>  
					<el-input v-model="tableHead.contractNo" size="mini" placeholder="合同编号"></el-input> 
				 </el-col> 
				 <el-col :span=2  >
					<span>合同金额:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.contractAmt" size="mini" placeholder="合同金额"
					 oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"></el-input> 
				</el-col> 
				<el-col :span=2 >
					<span>签订时间:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.contractTime" size="mini" placeholder="合同时间"></el-input> 
				</el-col> 				
			</el-row>
			<el-row :gutter=10 type="flex" justify="center">
				<el-col :span=2  >
					<span>船舶类型:</span>
				</el-col>
				
				<el-col :span=5>
					<el-select v-model="tableHead.tradeType" placeholder="船舶类型" size="mini" style="width:100%">       
							<el-option label="延绳钓" value="延绳钓"></el-option>
			                <el-option label="鱿鱼钓"  value="鱿鱼钓"></el-option>   
							<el-option label="欧式围网" value="欧式围网"></el-option>                 
							<el-option label="大型拖网" value="大型拖网"></el-option>   
							<el-option label="海事海工" value="海事海工"></el-option>                 <el-option label="转口贸易" value="转口贸易"></el-option>
			        </el-select> 
				</el-col>
				 <el-col :span=2  >
					<span>船名号:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.contractAmt" size="mini" placeholder="船名号"
					 oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"></el-input> 
				</el-col> 
				<el-col :span=2 >
					<span>船东:</span> 
				</el-col>
				<el-col :span=5> 
					<el-input v-model="tableHead.contractTime" size="mini" placeholder="船东"></el-input> 
				 </el-col> 				
			</el-row>
			<el-row :gutter=10 type="flex" justify="center">
				<el-col :span=2  >
					<span>船厂:</span> 
				</el-col>
				<el-col :span=5>  
					<el-input v-model="tableHead.contractNo" size="mini" placeholder="船厂"></el-input> 
				 </el-col> 
				 <el-col :span=2  >
					<span>设计院所:</span> 
				</el-col>
				<el-col :span=5>
					<el-input v-model="tableHead.contractAmt" size="mini" placeholder="设计院所"
					 oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"></el-input> 
				</el-col> 
				<el-col :span=2 >
					<span>船级社:</span> 
				</el-col>
				<el-col :span=5> 
					<el-input v-model="tableHead.contractTime" size="mini" placeholder="船级社"></el-input> 
				 </el-col> 				
			</el-row>

			<el-row :gutter=10 type="flex" justify="center"> 
				<el-col :span=2 >
					<span>作业方式:</span> 
				</el-col>
				<el-col :span=19 >
					<el-checkbox-group v-model="checkList">
						<el-checkbox label="延绳钓"  ></el-checkbox>
						<el-checkbox label="鱿鱼钓"></el-checkbox>
						<el-checkbox label="秋刀鱼钓"></el-checkbox>
						<el-checkbox label="欧围"  ></el-checkbox>
						<el-checkbox label="拖网"  ></el-checkbox>
						<el-checkbox label="大围" disabled></el-checkbox>
						<el-checkbox label="带鱼钓"  ></el-checkbox>
						<el-checkbox label="灯光围网"  ></el-checkbox>
						<el-checkbox label="灯光罩网" ></el-checkbox>
					</el-checkbox-group>
				</el-col> 
			</el-row> 
			<el-row :gutter=10 type="flex" justify="center"> 
				<el-col :span=2 >
					<span>备注:</span> 
				</el-col>
				<el-col :span=19 >
					<el-input type="textarea" :rows="2" v-model="tableHead.outMemo" size=mini 
						placeholder="请输入备注内容" ></el-input> 
				</el-col> 
			</el-row> 
			<el-row :gutter=10 type="flex" justify="center"> 
				<el-col :span=6>ID:
					<span >{{tableHead.id}}</span>
				 </el-col>
				
				<el-col :span=6> 状态:
					<span v-if="tableHead.status == 0">尚未登记</span> 
					<span v-if="tableHead.status == 1">完成正常登记</span>
					<span v-if="tableHead.status == 2">完成技术核算</span> 
					<span v-if="tableHead.status == 3">完成财务核算</span>
					<span v-if="tableHead.status == 4">完成打单</span> 
					<span v-if="tableHead.status == 5">完成打印</span>
					<span v-if="tableHead.status == 6">作废</span>
				</el-col> 
				<el-col :span=6>维护人员:
					<span >{{tableHead.trueName}}</span>
				</el-col> 	
			</el-row> 
					
			<el-row :gutter=10 type="flex" justify="center">
				<el-col align="center">
					<el-button size="mini" type="primary" >保存信息</el-button> 
					<el-button size="mini" type="primary" >清空数据</el-button> 
					<el-button type="primary" size="mini" name="上传你的上传">上传附件</el-button>	
				</el-col>
			</el-row>
			<el-row :gutter=10 type="flex" justify="center"></el-row>
			
		</div>

	
	</div>
	
	
<script>
var head = new Vue({ 
	el: "#headVue",
	data:{
			prodLines: [{id:0,quotationID:null,productName:"",confirmName:"",
				productCode:"",specification:"",unit:"",quantity:""}],
			
			tableHead:{},
			checkList:['延绳钓','鱿鱼钓']
			
		},
	methods: 
	{ 
		delRow:function(val){

		},
		
		
	}
	});


</script>

<style >
	
	.el-table{
       width:99.9%!important;
	}
	.el-row {
    margin-bottom: 20px;
    
  }
  el-row:last-child {
      margin-bottom: 0;
    }

  .el-col {
    border-radius: 4px;
  }
  .bg-purple-dark {
    background: #99a9bf;
  }
  .bg-purple {
    background: #d3dce6;
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
 
  .myMargin{
  	margin-left:2%;
  }
</style> 
</body>

</html>
